/*
 * @Description:路由
 * @Author: HYH
 * @LastEditors: HYH
 * @LastEditTime: 2022-12-28 14:28:33
 */
import { createRouter, createWebHashHistory, Router } from 'vue-router'
import { RouteRecordRaw } from 'vue-router'
/**扩展 */
type RouteRecordRawExt = RouteRecordRaw & { children?: RouteRecordRawExt[] }

/**初始化路由信息 */
export const initRouter = (): Router => {
  const routes: RouteRecordRawExt[] = [
    {
      path: '/',
      redirect: '/layout'
    },
    {
      path: '/layout',
      redirect: '/layout/home',
      component: () => import('@/layout/index.vue'),
      children: [
        // 首页
        {
          path: 'home',
          component: () => import('@/views/home/index.vue'),
          meta: {
            title: lang('home.home')
          }
        },
        // 组件
        {
          path: 'components',
          component: () => import('@/views/components/index.vue'),
          children: [
            {
              path: 'editor',
              component: () => import('@/views/components/editor/index.vue'),
              meta: {
                title: lang('side.richText')
              }
            },
            {
              path: 'viewImage',
              component: () => import('@/views/components/viewImage/index.vue'),
              meta: {
                title: lang('side.viewImage')
              }
            },
            // 图片剪裁
            {
              path: 'clip',
              component: () => import('@/views/components/clip/index.vue'),
              meta: {
                title: '图片剪裁'
              }
            }
          ]
        },
        // 指令
        {
          path: 'directives',
          component: () => import('@/views/directives/index.vue'),
          children: [
            // 复制
            {
              path: 'copy',
              component: () => import('@/views/directives/copy/index.vue'),
              meta: {
                title: lang('side.copy')
              }
            },
            //聚焦
            {
              path: 'focus',
              component: () => import('@/views/directives/focus/index.vue'),
              meta: {
                title: lang('side.focus')
              }
            },
            //长按
            {
              path: 'longPress',
              component: () => import('@/views/directives/longPress/index.vue'),
              meta: {
                title: '长按'
              }
            },
            // 水印
            {
              path: 'watermark',
              name: 'watermark',
              component: () => import('@/views/directives/watermark/index.vue'),
              meta: {
                title: lang('side.watermark')
              }
            }
          ]
        }
      ]
    },
    //404
    {
      path: '/404',
      component: () => import('@/views/404/index.vue'),
      meta: {
        title: lang('common.pageNotFound')
      }
    },
    //重定向未匹配的路由
    {
      path: '/:pathMatch(.*)',
      component: () => import('@/views/404/index.vue'),
      meta: {
        title: lang('common.pageNotFound')
      }
    }
  ]
  const router = createRouter({
    history: createWebHashHistory(),
    routes
  })
  router.beforeEach((to, from, next) => {
    const { title } = to.meta
    title && ((document as any).title = title)
    next()
  })
  return router
}
